<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>个人主页</title>
    <link rel="shortcut icon" href="images/favicon.ico"/>
    <link rel="bookmark" href="images/favicon.ico"/>
<link href="personal.css" rel="stylesheet">
    <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container-fluid">
    <div class="row">

        <nav class="navbar navbar-inverse nav-justified" role="navigation">

            <div class="navbar-header" style="margin-left: 50px">
                <a class="navbar-brand" href="#">
                    <span class="glyphicon glyphicon-home"></span> Cose
                </a>
            </div>
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">
                    <span class="glyphicon glyphicon-comment">会话</span>
                </a></li>
                <li class="divider-vertical">
                </li>
                <li><a href="/circle">
                    <span class="glyphicon glyphicon-th-large">朋友圈</span>
                </a></li>

            </ul>
            <ul class="nav pull-right navbar-nav" style="margin-right: 50px;">

                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown">
                        <span class="glyphicon glyphicon-user">用户</span>
                        <b class="caret"></b>
                    </a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="/userInfos">个人信息</a></li>
                        <li><a href="/personal">个人主页</a></li>
                    </ul>
                </li>
                <!--退出按钮  -->
                <li><a href="#">
                    <span class="glyphicon glyphicon-off">退出</span>
                </a></li>
            </ul>
        </nav>
<!--以上是导航栏  -->

        <div class="col-md-10 col-md-offset-1">
            <div class="col-md-3">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <img src="toux.jpeg" class="img-circle" style="height: 60px;height: 60px;">

                    </div>

                    <ul class="nav nav-pills nav-stacked">
                        <li><a href="#">Home</a></li>
                        <li><a href="#">SVN</a></li>
                        <li><a href="#">iOS</a></li>
                        <li><a href="#">VB.Net</a></li>
                        <li><a href="#">Java</a></li>
                        <li><a href="#">PHP</a></li>
                    </ul>
                </div>
            </div>
            <div class="col-md-6">
            <div class="panel panel-default">
                <div class="panel-heading">
                   <b>发表说说</b>
                </div>
                    <textarea style="width: 100%"></textarea>
                <div class="panel-footer">
                   <span class="logo"  data-toggle="modal" title="添加表情"  data-target="tooltip">
                     <span class="glyphicon glyphicon-dashboard"></span>
                   </span>
                   <span class="logo"  data-toggle="modal" title="添加图片"  data-target="tooltip">
                     <span class="glyphicon glyphicon-picture"></span>
                   </span>

                    <script>
                        $(function () { $("[data-toggle='tooltip']").tooltip(); });
                    </script>
                      <div class="release">
                          <button type="button" class="btn btn-primary">提交</button>
                      </div>
                </div>
            </div>
<!-- 以上是发表说说 -->
                <div class="panel panel-default">
                    <div class="panel-heading">
                      <b>张三</b>
                        <span style="float: right; margin-right: 20px">2012-03-04 13:03</span>
                    </div>
                    <div class="panel-body">
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src='f01d.png' style="width: 80px;height: 80px"
                                     alt="媒体对象">
                            </a>
                            <div class="media-body">
                                <h4 class="media-heading">媒体标题</h4>
                                这是一些示例文本。这是一些示例文本。
                                这是一些示例文本。这是一些示例文本。
                                这是一些示例文本。这是一些示例文本。
                                这是一些示例文本。这是一些示例文本。
                                这是一些示例文本。这是一些示例文本。
                            </div>
                        </div>
                    </div>
                    <div class="panel-footer">
                       <span class="pinglun" data-toggle="modal" title="点赞"  data-target="tooltip">
                         <span class="glyphicon glyphicon-thumbs-up">赞</span>
                       </span>
                       <span class="pinglun" data-toggle="modal" title="发表评论"  data-target="tooltip">
                          <span class="glyphicon glyphicon-edit">评论</span>
                       </span>
                        <span class="pinglun" data-toggle="modal" title="转发"  data-target="tooltip">
                          <span class="glyphicon glyphicon-share">转发</span>
                       </span>
                        <div class="row" style="margin-top: 10px">
                            <div class="col-md-10">
                                <input type="text" class="form-control" id="name"
                                       placeholder="发表你的意见">
                            </div>
                            <div class="col-md-2">
                                <button type="button" class="btn btn-primary">发表</button>
                            </div>
                        </div>
                        <span><a href="">李四：</a>这个东西太好玩了，大家快ffddsss来玩吧</span><br>
                        <span><a href="">李四：</a>这个东西太好玩了，大家快来s玩吧</span><br>
                        <span><a href="">李四：</a>这个东西太好玩了，大家快saaaasssaas来玩吧</span><br>
                    </div>
                </div>

                <!-- 1--------------------------------------------1 -->
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <b>张三</b>
                        <span style="float: right; margin-right: 20px">2012-03-04 13:05</span>
                    </div>
                    <div class="panel-body">
                        <p> 这是一些示例文本。这是一些示例文本。
                            这是一些示例文本。这是一些示例文本。
                            这是一些示例文本。这是一些示例文本。
                            这是一些示例文本。这是一些示例文本。
                            这是一些示例文本。这是一些示例文本。</p>
                       <img src="ds.jpg" style="width: 150px; height: 100px;margin: 3px">
                        <img src="ds.jpg" style="width: 150px; height: 100px;margin: 3px">
                        <img src="ds.jpg" style="width: 150px; height: 100px;margin: 3px">
                        <img src="ds.jpg" style="width: 150px; height: 100px;margin: 3px">
                        <img src="ds.jpg" style="width: 150px; height: 100px;margin: 3px">
                        <img src="ds.jpg" style="width: 150px; height: 100px;margin: 3px">
                    </div>
                    <div class="panel-footer">
                        <span class="pinglun" data-toggle="modal" title="点赞"  data-target="tooltip">
                         <span class="glyphicon glyphicon-thumbs-up">赞</span>
                       </span>
                       <span class="pinglun" data-toggle="modal" title="发表评论"  data-target="tooltip">
                          <span class="glyphicon glyphicon-edit">评论</span>
                       </span>
                        <span class="pinglun" data-toggle="modal" title="转发"  data-target="tooltip">
                          <span class="glyphicon glyphicon-share">转发</span>
                       </span>

                        <div class="row" style="margin-top: 10px">
                            <div class="col-md-10">
                                <input type="text" class="form-control" id="name"
                                       placeholder="发表你的意见">
                            </div>
                            <div class="col-md-2">
                                <button type="button" class="btn btn-primary">发表</button>
                            </div>
                        </div>
                        <span><a href="">李四：</a>这个东西太好玩了，大家快ffddsss来玩吧</span><br>
                        <span><a href="">李四：</a>这个东西太好玩了，大家快来s玩吧</span><br>
                        <span><a href="">李四：</a>这个东西太好玩了，大家快saaaasssaas来玩吧</span><br>
                    </div>
                </div>

            </div>
            <div class="col-md-3">
                <div class="panel panel-default">
                    <div class="panel-heading">
                       <b>访客记录</b>
                    </div>
                    <div class="panel-body">
                      <img src="toux.jpeg" class="img-thumbnail" style="height: 50px;height: 50px">
                        <img src="toux.jpeg" class="img-thumbnail" style="height: 50px;height: 50px">
                        <img src="toux.jpeg" class="img-thumbnail" style="height: 50px;height: 50px">
                        <img src="toux.jpeg" class="img-thumbnail" style="height: 50px;height: 50px">
                        <img src="toux.jpeg" class="img-thumbnail" style="height: 50px;height: 50px">
                    </div>
                </div>
            </div>
            </div>


    </div>
</div>
</div>
</body>
</html>